<template>
    <div>
        <!-- 面包屑导航区 -->
        <el-breadcrumb separator-class="el-icon-arrow-right">
            <el-breadcrumb-item>会议室查询</el-breadcrumb-item>
            <el-breadcrumb-item>全部会议室</el-breadcrumb-item>
        </el-breadcrumb>

        <!-- 当前预定 -->
        <el-card>
            <el-table :data="tableData">
                <el-table-column label="会议室唯一id" prop="cid"></el-table-column>
                <el-table-column label="会议室名" prop="name"></el-table-column>
                <el-table-column label="类型" prop="type"></el-table-column>
                <el-table-column label="最大容纳人数" prop="capacity"></el-table-column>
                <el-table-column label="当前状态" prop="status">
                </el-table-column>
            </el-table>

            <el-pagination
                    background
                    layout="prev, pager, next"
                    :page-size="pageSize"
                    :total="total"
                    @current-change="page">
            </el-pagination>
        </el-card>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                pageSize: 1,
                total: 1,
                tableData: null
            }
        },

        methods: {
            async page(currentPage){
                console.log(currentPage)
                this.$axios({
                    method:"post",
                    url:"http://localhost:80/conferenceroom/selectIsUsePage",
                    params:{
                        current:currentPage,
                        size:5
                    }
                }).then(res=>{

                    console.log(res)
                    this.pageSize = res.data.data.size
                    this.total = res.data.data.total
                    this.tableData= res.data.data.records
                })
                // console.log(res)
            },
            getPage(){
                this.$axios({
                    method:"post",
                    url:"http://localhost:80/conferenceroom/selectIsUsePage",
                    params:{
                        current:1,
                        size:5
                    }
                }).then(res=>{
                    console.log(res)
                    this.pageSize = res.data.data.size
                    this.total = res.data.data.total
                    this.tableData= res.data.data.records
                })
                // console.log(res)
            }
        },

        async created() {
            this.getPage()
        }
    };
</script>

<style lang="less" scoped>
</style>
